<template>
  <div class="gen-generator-container">
    <!-- ===================== 查询表单 begin ===================== -->
    <el-form :inline="true" :model="queryForm" ref="queryForm" class="demo-form-inline" size="small">
      <el-form-item label="表名" prop="name">
        <el-input v-model.trim="queryForm.name" placeholder="表名" @keyup.enter.native="page"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" @click="page" size="mini">查询</el-button>
        <el-button @click="resetForm('queryForm')" icon="el-icon-refresh" size="mini">重置</el-button>
      </el-form-item>
    </el-form>
    <!-- ===================== 查询表单 end ======================= -->

    <!-- ===================== 操作按钮 begin ===================== -->
    <el-row :gutter="10" class="mb8" style="margin-bottom: 10px; margin-left: 0px; margin-right: 0px">
      <el-button type="primary" icon="el-icon-edit" size="mini" @click="createBatch">生成</el-button>
      <el-button type="primary" icon="el-icon-download" size="mini" @click="createZipBatch">zip</el-button>
      <!--<el-button type="primary" icon="el-icon-circle-plus-outline" size="mini">导入</el-button>-->
      <el-button type="danger" plain size="mini" icon="el-icon-delete" @click="deleteGenTableBatch">删除</el-button>
    </el-row>
    <!-- ===================== 操作按钮 end ======================= -->

    <!-- ===================== 数据列表 begin ===================== -->
    <el-table
      size="medium"
      class="gen-table"
      ref="multipleTable"
      :data="genTableList"
      tooltip-effect="dark"
      style="width: 100%"
      @selection-change="handleSelectionChange">
      <el-table-column type="selection"></el-table-column>
      <!--<el-table-column prop="id" label="id"l-table-column>-->
      <el-table-column prop="chName" label="说明"></el-table-column>
      <el-table-column prop="className" label="类名"></el-table-column>
      <el-table-column prop="name" label="表名"></el-table-column>
      <!--<el-table-column prop="packagePath" label="包路径"l-table-column>-->
      <!--<el-table-column prop="moduleName" label="模块名"l-table-column>-->
      <!--<el-table-column prop="subModuleName" label="子模块名"l-table-column>-->
      <!--<el-table-column prop="functionAuthor" label="功能作者"l-table-column>-->
      <el-table-column prop="genTypeCode" label="生成方式"></el-table-column>
      <!--<el-table-column prop="remarks" label="备注" show-overflow-tooltip></el-table-column>-->
      <el-table-column label="更新日期">
        <template slot-scope="scope" >{{ scope.row.createDate | dataFormat }}</template>
      </el-table-column>
      <el-table-column label="操作" width="400">
        <template slot-scope="scope">
          <el-button type="primary" plain size="mini" icon="el-icon-search" @click="doPreview(scope.row)">预览</el-button>
          <el-button type="primary" plain size="mini" icon="el-icon-edit" @click="doEdit(scope.row)">编辑</el-button>
          <el-button type="primary" plain size="mini" icon="el-icon-lollipop" @click="doCreate(scope.row)">生成</el-button>
          <el-button type="danger" plain size="mini" icon="el-icon-delete" @click="deleteGenTable(scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <!-- ===================== 数据列表 end ======================= -->

    <!-- ===================== 分页组件 begin ===================== -->
    <pagination v-show="total>0" :total="total" :page.sync="queryForm.pageNumber" :limit.sync="queryForm.pageSize" @pagination="page" />
    <!-- ===================== 分页组件 end ======================= -->

    <!-- ===================== 编辑弹窗 begin ===================== -->
    <el-dialog
      title="标题"
      width="95%"
      top="5vh"
      :center="true"
      :visible.sync="editDialogVisible"
      :append-to-body="true">
      <div class="edit-dialog-div">
        <el-tabs v-model="editTabDefaultActiveName" @tab-click="editDialogTabHandleClick">
          <!-- ================== 表信息 Tab begin ==================== -->
          <el-tab-pane label="表信息" name="first">
            <el-form ref="form" :model="genTable" label-width="80px" size="small">
              <el-row>
                <el-col :span="8">
                  <el-form-item label="表名称">
                    <el-input v-model="genTable.name" clearable></el-input>
                  </el-form-item>
                  <el-form-item label="类名">
                    <el-input v-model="genTable.className" clearable></el-input>
                  </el-form-item>
                  <el-form-item label="说明">
                    <el-input v-model="genTable.chName" clearable></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="包路径">
                    <el-input v-model="genTable.packagePath" clearable></el-input>
                  </el-form-item>
                  <el-form-item label="模块">
                    <el-input v-model="genTable.moduleName" clearable></el-input>
                  </el-form-item>
                  <el-form-item label="子模块">
                    <el-input v-model="genTable.subModuleName" clearable></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="功能作者">
                    <el-input v-model="genTable.functionAuthor" clearable></el-input>
                  </el-form-item>
                  <el-form-item label="备注">
                    <el-input v-model="genTable.remarks" clearable></el-input>
                  </el-form-item>
                  <el-form-item label="生成方式">
                    <el-select
                      v-model="genTable.genTypeCode"
                      placeholder="请选择生成方式"
                      style="width: 100%"
                      @change="selectGenTypeChange"
                    >
                      <el-option v-for="item in genTypeList" :key="item.value" :label="item.label" :value="item.value"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
              </el-row>

              <!-- （主子表）下拉框生成模板 begin -->
              <el-row
                v-for="(genTableChild, index) in genTable.genTableChilds"
                :label="'子表' + (index+1)"
                :key="index"
                :prop="'genTableChild.' + index + '.value'"
              >
                <el-col :span="16">
                  <el-row>
                    <el-col :span="8">
                      <el-form-item label="子表">
                        <el-select v-model="genTableChild.name" filterable placeholder="请选择" @change="selectChildTableChange" style="width: 100%">
                          <el-option
                            v-for="item in genTableList"
                            :key="item.name"
                            :label="item.name"
                            :value="item.name">
                          </el-option>
                        </el-select>
                      </el-form-item>
                    </el-col>
                    <el-col :span="8">
                      <el-form-item label="子表字段">
                        <el-select v-model="genTableChild.field" filterable placeholder="请选择" @change="childTableFieldChange" style="width: 100%">
                          <el-option
                            v-for="item in childTableFieldList"
                            :key="item.name"
                            :label="item.name"
                            :value="item.name">
                          </el-option>
                        </el-select>
                      </el-form-item>
                    </el-col>
                    <el-col :span="8">
                      <el-form-item label="主表字段">
                        <el-select v-model="genTableChild.mainField" filterable placeholder="请选择" style="width: 100%">
                          <el-option
                            v-for="item in genTable.columnList"
                            :key="item.name"
                            :label="item.name"
                            :value="item.name">
                          </el-option>
                        </el-select>
                      </el-form-item>
                    </el-col>
                  </el-row>
                </el-col>
                <el-col :span="8">
                  <el-button @click.prevent="removeChild(genTableChild)" size="small">删除</el-button>
                  <el-button type="primary" size="small" @click="addDomain">添加</el-button>
                </el-col>
              </el-row>
              <!-- （主子表）下拉框生成模板 end   -->
            </el-form>
          </el-tab-pane>
          <!-- ================== 表信息 Tab end ====================== -->

          <!-- ================== 列信息 Tab begin ==================== -->
          <el-tab-pane label="列信息" name="second">
            <el-table
              size="medium"
              height="500px"
              class="data-table"
              ref="multipleTable"
              :data="genTable.columnList"
              tooltip-effect="dark"
              style="width: 100%"
              @selection-change="handleSelectionChange">
              <el-table-column prop="comments" label="说明">
                <template slot-scope="scope">
                  <el-input v-model.trim="scope.row.comments" size="small" clearable/>
                </template>
              </el-table-column>
              <el-table-column prop="name" label="列名">
                <template slot-scope="scope">
                  <el-input v-model.trim="scope.row.name" size="small" clearable/>
                </template>
              </el-table-column>
              <el-table-column prop="javaField" label="JAVA字段">
                <template slot-scope="scope">
                  <el-input v-model.trim="scope.row.javaField" size="small" clearable/>
                </template>
              </el-table-column>
              <el-table-column prop="javaType" label="JAVA类型" width="110">
                <template slot-scope="scope">
                  <el-input v-model.trim="scope.row.javaType" size="small" clearable/>
                </template>
              </el-table-column>

              <el-table-column prop="jdbcType" label="JDBC类型" width="150">
                <template slot-scope="scope">
                  <el-input v-model.trim="scope.row.jdbcType" size="small" clearable/>
                </template>
              </el-table-column>
              <!--<el-table-column prop="isPk" label="是否主键">
                <template slot-scope="scope">
                  <el-switch v-model.trim="scope.row.isPk" :active-value="1" :inactive-value="0" />
                </template>
              </el-table-column>-->
              <!--<el-table-column prop="columnType" label="列类型">
                <template slot-scope="scope">
                  <el-input v-model.trim="scope.row.columnType" size="small" clearable/>
                </template>
              </el-table-column>-->
              <!--<el-table-column prop="valueLength" label="长度">
                <template slot-scope="scope">
                  <el-input v-model.trim="scope.row.valueLength" size="small" clearable/>
                </template>
              </el-table-column>-->
              <!--<el-table-column prop="intAccuracy" label="整数精度">
                <template slot-scope="scope">
                  <el-input v-model.trim="scope.row.intAccuracy" size="small" clearable/>
                </template>
              </el-table-column>-->
              <el-table-column width="80px" prop="isNull" label="可空">
                <template slot-scope="scope">
                  <el-switch v-model.trim="scope.row.isNull" :active-value="1" :inactive-value="0" />
                </template>
              </el-table-column>
              <el-table-column width="80px" prop="isAdd" label="添加">
                <template slot-scope="scope">
                  <el-switch v-model.trim="scope.row.isAdd" :active-value="1" :inactive-value="0" />
                </template>
              </el-table-column>
              <el-table-column width="80px" prop="isUpdate" label="更新">
                <template slot-scope="scope">
                  <el-switch v-model.trim="scope.row.isUpdate" :active-value="1" :inactive-value="0" />
                </template>
              </el-table-column>
              <el-table-column width="80px" prop="isQuery" label="查询">
                <template slot-scope="scope">
                  <el-switch v-model.trim="scope.row.isQuery" :active-value="1" :inactive-value="0" />
                </template>
              </el-table-column>
              <el-table-column prop="queryType" label="查询方式" width="130">
                <template slot-scope="scope">
                  <el-select v-model="scope.row.queryType" filterable placeholder="请选择" size="small" style="width: 100%">
                    <el-option
                      v-for="item in selectTypeOptions"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value">
                    </el-option>
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column prop="uiElement" label="前端UI" width="130">
                <template slot-scope="scope">
                  <el-select v-model="scope.row.uiElement" filterable placeholder="请选择" size="small" style="width: 100%">
                    <el-option
                      v-for="item in uiElements"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value">
                    </el-option>
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column prop="sort" label="排序" width="80">
                <template slot-scope="scope">
                  <el-input v-model.trim="scope.row.sort" size="small"/>
                </template>
              </el-table-column>
              <el-table-column prop="sort" label="" width="60">
                <template slot-scope="scope">
                  <i class="el-icon-circle-plus-outline" @click="addGenTableColumn(scope)"></i>
                  <i class="el-icon-circle-close" @click="delGenTableColumn(scope)"></i>
                </template>
              </el-table-column>
            </el-table>
          </el-tab-pane>
          <!-- ================== 列信息 Tab end ====================== -->
        </el-tabs>
      </div>

      <!-- 这里的内容会替换 title -->
      <span slot="title" class="dialog-footer">{{dialogTitle}}</span>
      <!-- 这里的内容会替换 footer -->
      <span slot="footer" class="dialog-footer">
        <el-button @click="editDialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="genTableSave">保 存</el-button>
        <!--<el-button type="primary" @click="genTableCreate">生成</el-button>
        <el-button type="primary" @click="genTableCreate">更新列</el-button>-->
      </span>
    </el-dialog>
    <!-- ===================== 编辑弹窗 end ======================= -->

    <!-- ===================== 预览弹窗 begin ===================== -->
    <el-dialog
      title="标题"
      width="80%"
      top="5vh"
      :center="true"
      :visible.sync="previewDialogVisible"
      :append-to-body="true">
      <!--<div class="edit-dialog-div"> 这个 class 会指定高度 -->
      <div>
        <el-tabs v-model="previewTabDefaultActiveName" @tab-click="editDialogTabHandleClick" tab-position="left">
          <el-tab-pane
            v-for="(previewVO, index) in previewDataList"
            :label="previewVO.fileName"
            :key="index"
            :name="previewVO.fileName"
          >
            <pre><code class="language-java">{{previewVO.fileContent}}</code></pre>
          </el-tab-pane>
        </el-tabs>
      </div>

      <!-- 这里的内容会替换 title -->
      <span slot="title" class="dialog-footer">{{previewDialogTitle}}</span>
      <!-- 这里的内容会替换 footer -->
      <span slot="footer" class="dialog-footer">
        <el-button @click="previewDialogVisible = false">关 闭</el-button>
        <el-button type="primary" @click="genTableCreate">生 成</el-button>
      </span>
    </el-dialog>
    <!-- ===================== 预览弹窗 end ======================= -->
  </div>
</template>

<script>
import { createByIds, delByGenTableName, get, getDataTableColumnList, pageList, update, preview, createZipByIds, resolveBlob } from '@/api/gen'
import { errorMsg, successMsg } from '@/api/message'
import Pagination from '@/components/Pagination/index'
import request from '@/util/request'
import Prism from '@/assets/prism/prism'

export default {
  name: 'GenTable',
  components: {
    Pagination
  },
  props: {},
  data () {
    return {
      // 数据总数
      total: 0,
      // 查询表单 Model
      queryForm: {
        name: '',
        remarks: '',
        pageNumber: 1,
        pageSize: 10
      },
      // 生成表列表 Model
      genTableList: [],
      // 生成表实体 Model
      genTable: {
        id: '', // id
        name: '', // 表名称
        className: '', // 类名
        chName: '', // 类中文名
        packagePath: '', // 包路径
        moduleName: '', // 模块名
        subModuleName: '', // 子模块名
        functionAuthor: '', // 功能作者
        genTypeCode: '', // 生成方式
        remarks: '', // 备注
        createDate: '', // 创建日期
        updateDate: '', // 更新日期
        columnList: '', // 表的列
        isCreate: false, // 是否生成
        genTableChilds: [
          {
            name: '', // 子表名称
            field: '', // 子表字段（子表中关联主表的字段）
            mainField: '' // 主表字段（主表中与 pk 关联的字段）
          }
        ] // 子表数据
      },
      // 勾选的表
      selectedTableList: [],

      /* ============ 编辑对话框属性 ============ */
      // 编辑对话框是否显示
      editDialogVisible: false,
      // 编辑对话框 title
      dialogTitle: '',
      // 编辑弹窗 tab 默认选项
      editTabDefaultActiveName: 'first',
      // 生成方式
      genTypeList: [],
      // 子表 column list
      childTableFieldList: [],
      // 查询类型
      selectTypeOptions: [
        {
          value: '=',
          label: '='
        },
        {
          value: '!=',
          label: '!='
        },
        {
          value: 'like',
          label: 'like'
        },
        {
          value: 'LeftLike',
          label: 'LeftLike'
        },
        {
          value: 'RightLike',
          label: 'RightLike'
        },
        {
          value: '>',
          label: '>'
        },
        {
          value: '>=',
          label: '>='
        },
        {
          value: '<',
          label: '<'
        },
        {
          value: '<=',
          label: '<='
        },
        {
          value: 'between',
          label: 'between'
        }
      ],
      // 生成前端UI元素
      uiElements: [
        {
          value: '文本框',
          label: '文本框'
        },
        {
          value: '日期',
          label: '日期'
        },
        {
          value: '下拉框',
          label: '下拉框'
        },
        {
          value: '单选框',
          label: '单选框'
        },
        {
          value: '多选框',
          label: '多选框'
        },
        {
          value: '开关',
          label: '开关'
        }
      ],
      /* ============ 编辑对话框属性 ============ */

      /* ============ 预览对话框属性 ============ */
      // 预览数据
      previewDataList: [
        {
          fileName: '', // 文件名称
          filePath: '', // 文件生成路径
          fileContent: '' // 文件内容
        }
      ],
      // 预览对话框是否显示
      previewDialogVisible: false,
      // 预览对话框 title
      previewDialogTitle: '',
      // 预览弹窗 tab 默认选项
      previewTabDefaultActiveName: ''
      /* ============ 预览对话框属性 ============ */
    }
  },
  computed: {},
  watch: {},
  created () {
    this.getGenTypeList()
    this.page()
  },
  filters: {
    dateFormat (value, format = 'YYYY-MM-DD HH:mm:ss') {
      // return moment(value).format(format)
    }
  },
  mounted () {},
  methods: {
    /* 表单重置 */
    resetForm (formName) {
      // 元素必须设置 prop 属性才会生效
      this.$refs[formName].resetFields()
      this.page()
    },
    /* 表单重置 */

    /* 分页查询表 */
    page () {
      // 获取表单绑定数据
      const vm = this
      const queryData = this.queryForm

      // 执行查询
      pageList(queryData).then(res => {
        // 查询成功，渲染数据
        vm.genTableList = res.data.data.list
        vm.total = res.data.data.total
      }).catch(err => {
        // 查询失败处理
        errorMsg(vm, err)
      })
    },
    /* 分页查询表 */

    /* 获取生成方式 */
    getGenTypeList () {
      const vm = this
      request({
        method: 'GET',
        url: '/genTable/getGenTypeList'
      }).then(res => {
        // 查询成功，渲染数据
        vm.genTypeList = res.data.data
      }).catch(err => {
        // 查询失败处理
        errorMsg(vm, err)
      })
    },
    /* 获取生成方式 */

    /* 保存所有勾选的表（勾选列表时会触发该事件） */
    handleSelectionChange (selectedRow) {
      // 这里会将所有选择的行通过 selectedRow 传进来
      this.selectedTableList = selectedRow
    },
    /* 保存所有勾选的表（勾选列表时会触发该事件） */

    /* 批量生成 */
    createBatch () {
      const vm = this
      if (vm.selectedTableList.length === 0) {
        vm.$message.error('请勾选要生成的表')
        return false
      }

      // 解析勾选的表 id，保存到 ids
      const ids = []
      for (var i = 0; i < vm.selectedTableList.length; i++) {
        var id = vm.selectedTableList[i].id
        ids.push(id)
      }

      // 请求
      createByIds(ids).then(res => {
        successMsg(vm, '生成成功')
      }).catch(err => {
        errorMsg(vm, err)
      })
    },
    /* 批量生成 */

    /* 批量生成（zip） */
    createZipBatch () {
      const vm = this
      if (vm.selectedTableList.length === 0) {
        vm.$message.error('请勾选要生成的表')
        return false
      }

      // 解析勾选的表 id，保存到 ids
      const ids = []
      for (var i = 0; i < vm.selectedTableList.length; i++) {
        var id = vm.selectedTableList[i].id
        ids.push(id)
      }

      // 请求
      createZipByIds(ids).then(res => {
        resolveBlob(res, 'application/zip')
      }).catch(err => {
        errorMsg(vm, err)
      })
    },
    /* 批量生成（zip） */

    /* ============== 预览 ============== */
    doPreview (row) {
      const vm = this
      // 清除缓存的数据
      vm.previewDataList = []
      // 用于预览窗口点击生成使用
      vm.genTable = row
      // 一、设置预览弹窗标题
      vm.previewDialogTitle = row.name + '（' + row.chName + '）' + '生成预览'
      // 二、向后台请求数据
      preview(row).then(res => {
        // 载入数据
        vm.previewDataList = res.data.data
        vm.timer = setTimeout(() => {
          Prism.highlightAll() // 这里加定时器让它后执行，不然没效果
        }, 0)
        // 设置默认显示的对话框
        vm.previewTabDefaultActiveName = vm.previewDataList[0].fileName
        // 打开对话框
        vm.previewDialogVisible = true
      }).catch(err => {
        vm.previewDialogVisible = false
        errorMsg(vm, err)
      })
    },
    /* ============== 预览 ============== */

    /* ============== 编辑 ============== */
    doEdit (row) {
      const vm = this
      // 一、打开对话框
      vm.editDialogVisible = true
      // 二、设置对话框标题
      vm.dialogTitle = row.name + ' ' + row.remarks
      // 三、向后台请求数据
      get(row).then(res => {
        this.genTable = res.data.data
        // 设置列默认的前端元素
        this.genTable.columnList.forEach(function (item) {
          if (item.uiElement == null) item.uiElement = vm.uiElements[0].value
        })
      }).catch(err => {
        errorMsg(vm, err)
      })
    },
    /* ============== 编辑 ============== */

    /* ============== 生成 ============== */
    doCreate (row) {
      const vm = this
      const ids = [row.id]
      // 请求
      createByIds(ids).then(res => {
        successMsg(vm, res.data.message)
      }).catch(err => {
        errorMsg(vm, err)
      })
    },
    /* ============== 生成 ============== */

    /* ============== 删除 ============== */
    deleteGenTable (row) {
      const vm = this
      this.$confirm('真的删除吗, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        const names = [row.name]
        delByGenTableName(names).then(res => {
          successMsg(vm, res.data.message)
          this.page()
        }).catch(err => {
          errorMsg(vm, err)
        })
      })
    },
    /* ============== 删除 ============== */

    /* ============== 批量删除表 ============== */
    deleteGenTableBatch () {
      const vm = this
      if (vm.selectedTableList.length === 0) {
        vm.$message.error('请勾选要删除的表')
        return false
      }

      // 解析勾选的表名，保存到tableNames
      const names = []
      vm.selectedTableList.forEach(function (item) {
        names.push(item.name)
      })

      delByGenTableName(names).then(res => {
        successMsg(vm, res.data.message)
        this.page()
      }).catch(err => {
        errorMsg(vm, err)
      })
    },
    /* ============== 批量删除表 ============== */

    // 编辑弹窗-Tab切换
    editDialogTabHandleClick (tab, event) {
      // console.log(tab, event)
    },

    // 编辑页面-选择生成方式
    selectGenTypeChange (val) {
      // 清除子表数据
      this.genTable.genTableChilds = []
      // 重新渲染（子表字段list）数据
      this.childTableFieldList = []
      // 如果是（主子表），添加空子表数据
      if (val === 'crud_child') {
        this.addDomain()
      }
    },

    // 编辑页面-选择子表
    selectChildTableChange (tableName) {
      // 重新加载数据
      getDataTableColumnList(tableName).then(res => {
        // 重新渲染数据
        this.childTableFieldList = []
        this.childTableFieldList = res.data.data
      }).catch(err => {
        // 查询失败处理
        errorMsg(err)
      })
    },
    // 编辑页面-选择子表

    // 编辑页面-选择子表字段
    childTableFieldChange (tableName) {
      // todo 验证子表是否已经选择
    },

    // 添加子表（当生成方式为主子表时）
    addDomain () {
      // 从后台获取的数据 genTableChilds 可能是空的，所以这里需要判断，避免因为 genTableChilds 是空的引起 push 时错误
      if (this.genTable.genTableChilds === null) {
        this.genTable.genTableChilds = []
      }
      this.genTable.genTableChilds.push(
        {
          name: '', // 子表名称
          field: '', // 子表字段（子表中关联主表的字段）
          mainField: this.genTable.columnList[0].name // 主表字段（主表中与 pk 关联的字段），这里默认设置为第一个（id）
        }
      )
    },

    // 删除子表（当生成方式为主子表时）
    removeChild (genTableChilds) {
      const index = this.genTable.genTableChilds.indexOf(genTableChilds)
      console.log(index)
      if (index !== -1) {
        this.genTable.genTableChilds.splice(index, 1)
      }
    },

    // 编辑页面-保存
    genTableSave () {
      const vm = this
      this.genTable.isCreate = false
      update(this.genTable).then(res => {
        successMsg(vm, res.data.message)
        this.page() // 重新加载数据
        this.editDialogVisible = false // 关闭编辑弹窗
      }).catch(err => {
        errorMsg(vm, err)
      })
    },

    // 编辑页面-生成
    genTableCreate () {
      const vm = this
      const ids = [vm.genTable.id]
      // 请求
      createByIds(ids).then(res => {
        successMsg(vm, '生成成功')
      }).catch(err => {
        errorMsg(vm, err)
      })
    },

    // 编辑页面-添加列
    addGenTableColumn (scope) {
      const column = {
        id: '', // id
        genTableName: '', // 所属表名称
        name: '', // 列名
        comments: '', // 列注释
        isPk: 0, // 是否主键（1：主键）
        jdbcType: '', // JDBC类型（大写）
        columnType: '', // 列类型（JDBC类型+长度）
        valueLength: 0, // 长度
        intAccuracy: 0, // 整数精度（小数点多少位）
        javaType: '', // JAVA类型
        javaField: '', // JAVA字段名
        isNull: 1, // 是否可为空（1：可为空；0：不为空）
        isQuery: 0, // 是否查询字段（1:是、0:否）
        isAdd: 1, // 是否添加（1:是、0:否）
        isUpdate: 1, // 是否更新（1:是、0:否）
        uiElement: '文本框', // 前端UI元素
        queryType: '', // 查询方式（等于、不等于、大于、小于、范围、左LIKE、右LIKE、左右LIKE）
        sort: scope.row.sort + 1 // 排序（升序）
      }
      this.genTable.columnList.splice((scope.$index + 1), 0, column)
    },

    // 编辑页面-删除列
    delGenTableColumn (scope) {
      this.genTable.columnList.splice(scope.$index, 1)
    }
  }
}
</script>

<style scoped lang="less">
  // 编辑弹窗高度（避免切换 tab 的时候高度变化）
  .edit-dialog-div {
    height: 60vh;
    overflow: auto;
  }
</style>
